<!DOCTYPE html>
<!--suppress JSUnresolvedFunction -->
<html xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
    <title>Welcome to Ramer's Blog</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/animejs/2.2.0/anime.min.js"></script>

    <script type="text/javascript" th:src="@{/libs/anime/fireworks.js}"></script>

    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/github-markdown-css/4.0.0/github-markdown.min.css"/>

    <script type="text/javascript">
      $(function() {

      });
    </script>
</head>
<body>
<canvas id="fireworks"></canvas>
<div class="wrap">
    <textarea style="display: none"></textarea>
    <div class="scroll-bar" style="height: 100px;width: 100%;background-color: lightyellow">
        <div>轮播图</div>
    </div>
    <div class="main-container">
        <div class="left-article">
            <div class="article-content markdown-body" th:each="article:${articles}">
                <h3 th:text="${article.title}"></h3>
                <div class="content" th:utext="${article.htmlContent}"></div>
            </div>
        </div>
        <div class="right-nav" style="position: absolute;width: 100px;background: transparent;overflow: hidden">导航2222
        </div>
    </div>
</div>
</body>
</html>